<template>
  <div class="m-container">
    <!-- 页面头部 start -->
    <div class="m-page-header">
      <h1 class="m-header__title">联创中心</h1>
      <div class="m-header__info">
        <p class="m-header__info__nickname">{{ realname }}</p>
        <div v-if="is_agent == 1" class="m-header__info__grade">
          <i class="iconfont icon-huangguan"></i>
          <p class="g-ml--5">董事</p>
        </div>
      </div>
    </div>
    <!-- 页面头部 end -->
    <!-- 立即提现 start -->
    <div class="m-card m-card--momey">
      <div class="m-momey__item">
        <p class="m-momey__item__num">0</p>
        <p class="m-money__item__title">上月累计销售</p>
      </div>
      <div class="m-momey__item">
        <p class="m-momey__item__num">0</p>
        <p class="m-money__item__title">上月奖励</p>
      </div>
      <!-- <div class="m-momey__item m-momey__item--btn">
        <van-button @click="goToWithdrawal" type="primary" size="small"
          >立即提现</van-button
        >
      </div> -->
    </div>
    <!-- 立即提现 end -->
    <!-- 全部订单明细 start -->
    <!-- <div class="m-card m-card--business m-card--p-0 g-mb--10">
      <a href="javascript:;"
         class="m-card__header">
        <h2 class="m-card__header__title">全部订单明细</h2>
        <div class="m-card__header__link">
          <van-icon size="16px"
                    color="#999"
                    name="arrow" />
        </div>
      </a>
      <div class="m-card_body">
        <van-tabs>
          <van-tab title="今日">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">1200.00</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">1200.00</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="昨日">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">1000.00</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">1000.00</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="近7日">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">2200.00</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">2200.00</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="近30日">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">3000.00</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">3000.00</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
        </van-tabs>
      </div>
    </div> -->
    <!-- 全部订单明细 end -->
    <!-- 分月结算明细 start -->
    <div class="m-card m-card--business m-card--p-0">
      <a href="javascript:;" class="m-card__header">
        <h2 class="m-card__header__title">分月结算明细</h2>
        <div class="m-card__header__link">
          <van-icon size="16px" color="#999" name="arrow" />
        </div>
      </a>
      <div class="m-card_body">
        <van-tabs>
          <van-tab title="12月">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="11月">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="09月">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
          <van-tab title="08月">
            <van-row type="flex">
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售金额</p>
                </div>
              </van-col>
              <van-col span="12">
                <div class="m-momey__item">
                  <p class="g-fs--16">0</p>
                  <p class="g-fs--12 g-c--gray">销售订单</p>
                </div>
              </van-col>
            </van-row>
          </van-tab>
        </van-tabs>
      </div>
    </div>
    <!-- 分月结算明细 end -->
  </div>
</template>

<script>
import { Button, Row, Col, Icon, Tab, Tabs } from "vant";
import { mapState } from "vuex";
export default {
  name: "business",
  components: {
    "van-button": Button,
    "van-row": Row,
    "van-col": Col,
    "van-icon": Icon,
    "van-tabs": Tabs,
    "van-tab": Tab
  },
  computed: {
    ...mapState({
      parent_number: state =>
        (state.userInfo && state.userInfo.parent_number) || "",
      bank: state => (state.userInfo && state.userInfo.bank) || "",
      bankcard: state => (state.userInfo && state.userInfo.bankcard) || "",
      id_card: state => (state.userInfo && state.userInfo.id_card) || "",
      mobile: state => (state.userInfo && state.userInfo.mobile) || "",
      is_agent: state => (state.userInfo && state.userInfo.is_agent) || "",
      realname: state => (state.userInfo && state.userInfo.realname) || "",
      receiver_address: state =>
        (state.userInfo && state.userInfo.receiver_address) || "",
      receiver_area_name: state =>
        (state.userInfo && state.userInfo.receiver_area_name) || ""
    })
  },
  methods: {
    goToWithdrawal() {
      this.$router.push({
        name: "withdrawal"
      });
    }
  }
};
</script>

<style lang="scss">
.m-card--business.m-card {
  flex-direction: column;
}
.m-card--business {
  .m-momey__item {
    padding: 20px 0;
  }
}
</style>
